<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
	<title>${shopName!"车辆列表页面"}</title>
	<style type="text/css">
		*{margin: 0;padding: 0;font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
		.banner{height: 100px;background: #ccc;overflow: hidden;}
		.banner img{width: 100%;height: 100%;}
		.shop-info{padding: 15px 15px 15px 15px;position: relative;min-height: 90px;background: #f5f5f5;}
		.shop-img{width: 90px;height: 90px;position: absolute;top: 50%;left: 15px;margin-top: -45px;display: none;}
		.shop-img img{height: 100%;width: 100%;}
		.shop-txt h5{height: 30px;font-size: 14px;line-height: 30px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
		.shop-txt p{color: #aaa;font-size: 14px;line-height: 30px;height: 30px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
		.shop-ads{padding-left: 23px;background-image: url(${erpContextPath}/shareTemplate/ads.png);background-repeat: no-repeat;background-position: 0px 50%;background-size: 13px;}
		.shop-tel{padding-left: 23px;background-image: url(${erpContextPath}/shareTemplate/tel.png);background-repeat: no-repeat;background-position: 0px 50%;background-size: 15px;}
		.car-item{padding: 15px 15px 15px 150px;min-height: 90px;position: relative;border-bottom:1px solid #f8f8f8;}
		.car-img {width: 120px;height: 90px;position: absolute;top: 50%;left: 15px;margin-top: -45px;}
		.car-img img{height: 100%;width: 100%;}
		.car-txt h5{margin-bottom: 10px;height: 36px;overflow: hidden;}
		.car-txt p{color: #aaa;font-size: 12px;line-height: 20px;height: 20px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
		.orange{color: #ff6816;}
		a{text-decoration:none;color: #000}
		.auth{ position: absolute; left: 0px; top: 0px;z-index: 1}
		.auth img{ width: 75px; height: 20px;} 
		.car-state{ position: absolute; right: 0; top: 0;  overflow: hidden; width: 100px; height: 100px;}
		.car-state em{ position: absolute; right: -33px; top: 10px; width: 100%; background: #3186DC; color: #fff; font-size: 12px; text-align: center; padding:2px 10px;
			transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-webkit-transform: rotate(45deg);
		 }
	</style>
</head>
<body>
	<div>
		<div class="banner">
			<img src="${erpContextPath}/shareTemplate/share-banner.png">
		</div>
		<div class="shop-info">
			<div class="shop-img">
				<img src="https://erp.anpxd.com/wx/dist/static/images/default.png" onerror="javascript:this.src='https://erp.anpxd.com/wx/dist/static/images/default.png'" />
			</div>
			<div class="shop-txt">
				<h5>${shopName!""}</h5>
				<p class="shop-ads">${shopAddress!""}</p>
				<p class="shop-tel">${userMobile!""}</p>
			</div>
		</div>
		<ul>
			<% for(var car in cars) { %>
				<a href="${erpContextPath}/mshop/src/cars_share.html?marketId=${marketId!}&shopId=${shopId!}&imgUrl=${filePath!}&customerShopId=false&carId=${car.carId!}&os=false&shareUserName=${userName!}&shareUserMobile=${userMobile!}">
					<li class="car-item">
						<div class="car-txt">
							<h5>${car.carTitle!""}</h5>
							<p>
								${trim(car.carMileage!,2) + '万公里'}/
								<% if(car.carLicenceState! == 1){ %>
									${car.carLicenceDate!, dateFormat="yyyy-MM"}
								<% }else if(car.carLicenceState! == 2){ %>
									未上牌
								<% }else if(car.carLicenceState! == 3){ %>
									新车
								<% } %>
							</p>
							<p>零售价：<span class="orange">${car.carRetailPrice!"面议" == 0?"面议":car.carRetailPrice + '万'}</span></p>
						</div>
						<div class="car-img">
							<% if(car.carAuthState == 10){ %>
								<span class="auth">
									<img src="${erpContextPath}/shareTemplate/mark.png" alt="" />
								</span>
							<% } %>
							<img src="${filePath}${car.carImageUrl}.r_400xh_300" onerror="javascript:this.src='https://erp.anpxd.com/wx/dist/static/images/default.png'" />
							<% if(car.carBargainPriceState == 1){ %>
								<div class="car-state" ><em style="background: #FF6816;">特卖</em></div>
							<% } %>
							<% if(car.carOrderState == 1){ %>
								<div class="car-state"><em>已预定</em></div>
							<% } %>
						</div>
					</li>
				</a>
			<% } %>
		</ul>
	</div>
</body>
</html>